{:W('Cate/header')}
{:W('Cate/left')}

<!--内容部分-->
<div class="content">
    <div class="title">
        <p>服务管理</p>
        <i class="icon-angle-right"></i>
        <p><a href="javascript:;" onClick="javascript :history.go(-1);" style="color:#515974">开通服务</a></p>
        <i class="icon-angle-right"></i>
        <p class="active">升级</p>
    </div>
    <div class="admin_list clearfix">
        <div class="create_order_title">
            <h4>当前服务</h4>
            <dl class="clearfix">
                <dt><span>资源名称：</span>{$info.name}</dt>
                <dd>
                    <span>计费方式：</span>
                    通道授权
                </dd>
                <dd>
                    <span>服务时长：</span>
                    {$info.serviceduration}
                </dd>
                <dd>
                    <span>并发量：</span>
                    {$info.servicecount}
                </dd>
            </dl>
            <h5>
                <span>服务到期时间：</span>
                {$info.endtime|date='Y-m-d H:i:s',###}
            </h5>
        </div>
        <p style="padding:5px 10px;font-size: 12px;color: #1c202b;">升级须知： 并发量升级，支付完成后立即生效。</p>
        <div class="create_order clearfix" style="border:none;">
            <dl class="clearfix">
                <dt>并发量</dt>
                <dd>
                    <volist name="upgrade" id="up" key="k">
                    <span data-json='{$up|json_encode}' <if condition="$k eq '1'"> class="active" </if> >{$up.upgrade}</span>
                    </volist>
                </dd>
            </dl>

            <dl class="clearfix">
                <dt>支付方式</dt>
                <dd>
                    <span data-type="0" class="active">线下支付</span>
                    <!--<label>
                        <i></i>
                        <input type="radio" name="zf">
                        <img src="__PUBLIC__/images/wx.jpg">
                    </label>
                    <label>
                        <i></i>
                        <input type="radio" name="zf">
                        <img src="__PUBLIC__/images/zfb.jpg">
                    </label>-->
                </dd>
            </dl>
            <dl class="clearfix">
                <dt>续费金额</dt>
                <dd>
                    <h3 id="upgrade_price">￥{$upgrade[0]['price']}</h3>
                </dd>
            </dl>
            <dl class="clearfix">
                <dt style="display: block">&emsp;</dt>
                <dd>
                    <button type="button" disabled style="background: #ececec;" value="确认支付">去支付</button>
                </dd>
            </dl>
        </div>
    </div>
</div>
<script>
    $(document).ready(function () {
        var create_order = $('.create_order');
        var create_orderDd = $('.create_order > dl > dd');
        create_orderDd.width(create_order.width() - 100);

        //单选
        create_order.find('input').click(function () {
            create_order.find('i').css('background','url(\'../Public/images/xuanze-1.png\') no-repeat');
            var _this = $(this);
            if(_this.is(':checked')){
                _this.prev().css('background','url(\'../Public/images/xuanze-2.png\') no-repeat')
            }else{
                _this.prev().css('background','url(\'../Public/images/xuanze-1.png\') no-repeat')
            }
        });
        $('.create_order > dl > dd > span').each(function () {
            var _this = $(this);
            _this.click(function () {
                _this.addClass('active').siblings().removeClass('active');
                var rInfo = _this.data('json');
                if(rInfo){
                    var oUpgrade = "<?php echo $info['servicecount']; ?>";
                    if(rInfo['upgrade'] > oUpgrade){
                        $('button[type="button"]').removeAttr('disabled').removeAttr('style');
                    } else {
                        $('button[type="button"]').attr('disabled','true').attr('style','background:#ececec;');
                    }
                    $('#upgrade_price').text('￥'+rInfo['price']);
                }
            })
        })

        // 去支付
        $('button[type="button"]').on('click',function(){
            var conf = {
                'resid':"<?php echo $info['id']; ?>",
                'count':$('.create_order dl').eq(0).find('span.active').data('json'),
                'paymentmethod':$('.create_order dl').eq(1).find('span.active').data('type'),
            };
            $.post("{:U('/open_record/upgrade_post')}",conf,function(data){
                if(data.result == '0'){
                    layer.msg(data.msg,{icon:1,time:2000},function(){
                        self.location = document.referrer;   // 返回上一页并刷新
                    });
                } else {
                    layer.msg(data.msg,{icon:2,time:2000});
                }
            })
        })

    })
</script>
</body>
</html>